import { FC, MutableRefObject, PropsWithChildren, useEffect, useRef } from 'react'
import { Button, message } from 'antd'
import type { ProFormInstance } from '@ant-design/pro-form'
import { ModalForm, ProFormSelect, ProFormText } from '@ant-design/pro-form'
import { ActionType } from '@ant-design/pro-table'
import { ModelFormModeEnum } from '@/enums/ModelFormModeEnum'
import { ApplicationDTO } from '@/model/efficient/ApplicationDTO'
import { SystemDictTypeDTO } from '@/model/system/SystemDictTypeDTO'
import { applicationSave, applicationUpdate } from '@/api/efficient/application'

interface ApplicationFormParam {
  mode: ModelFormModeEnum,
  row?: ApplicationDTO,
  applicationTypeDict: SystemDictTypeDTO,
  actionRef: MutableRefObject<ActionType>
}

const ApplicationForm: FC<ApplicationFormParam> = (props: PropsWithChildren<ApplicationFormParam>) => {
  const { mode, applicationTypeDict, row, actionRef } = props
  const formRef = useRef<ProFormInstance>()
  useEffect(() => {
    formRef.current?.setFieldsValue(row)
  }, [row])
  const formItemLayout = {
    labelCol: { span: 4 },
    wrapperCol: { span: 14 },
  }
  const applicationOptions = []
  if (applicationTypeDict != null) {
    applicationTypeDict.dict.forEach((item) => {
      applicationOptions.push({
        label: item.name,
        value: item.value,
      })
    })
  }

  return (
    <div className="application-form">
      <ModalForm<ApplicationDTO>
        formRef={formRef}
        title={ModelFormModeEnum.add === mode ? '新增' : '编辑'}
        trigger={<Button type={ModelFormModeEnum.add === mode ? 'primary' : 'link'}>{ModelFormModeEnum.add === mode ? '新增' : '编辑'}</Button>}
        layout="horizontal"
        {...formItemLayout}
        onFinish={async (values) => {
          if (mode === ModelFormModeEnum.add) await applicationSave(values)
          else if (mode === ModelFormModeEnum.update) await applicationUpdate(values)
          message.success(`${ModelFormModeEnum.add === mode ? '新增' : '编辑'}成功`)
          formRef.current?.resetFields()
          await actionRef.current.reload()
          return true
        }}
      >
        <ProFormText
          name="id"
          label="id"
          placeholder="id"
          hidden
        />
        <ProFormText
          name="code"
          label="应用code"
          placeholder="请输入应用code"
          rules={[{ required: true, message: '请输入应用code' }]}
        />
        <ProFormText
          name="name"
          label="应用名称"
          placeholder="请输入应用名称"
          rules={[{ required: true, message: '请输入应用名称' }]}
        />
        <ProFormText
          name="gitAddress"
          label="git地址"
          placeholder="请输入应用git地址"
          rules={[{ required: true, message: '请输入应用git地址' }]}
        />
        <ProFormSelect
          name="applicationType"
          label="应用类型"
          placeholder="请选择应用类型"
          rules={[{ required: true, message: '请选择应用类型' }]}
          options={applicationOptions}
        />
        <ProFormText
          name="environment"
          label="运行环境"
          placeholder="请选择运行环境"
          tooltip="运行/编译 需要的环境"
        />
        <ProFormText
          name="compileModule"
          label="编译模块"
          placeholder="请输入编译模块"
        />
        <ProFormText
          name="principal"
          label="负责人"
          placeholder="请输入负责人"
          rules={[{ required: true, message: '请输入负责人' }]}
        />
      </ModalForm>
    </div>
  )
}

export default ApplicationForm
